<template>
<div>
        <div class="componentClassTitle">类型</div>
        <u-button style="margin-right:20px;margin-bottom:20px;" color="primary">主要按钮</u-button>
        <u-button style="margin-right:20px;margin-bottom:20px;" color="primary_secondary">次要按钮</u-button>
        <u-button style="margin-right:20px;margin-bottom:20px;">普通按钮</u-button>
        <u-button style="margin-right:20px;margin-bottom:20px;" color="danger">危险操作按钮</u-button>
        <u-button style="margin-right:20px;margin-bottom:20px;" color="danger_secondary">次要危险操作按钮</u-button>

        <div class="componentClassTitle">禁用</div>
        <u-button style="margin-right:20px;margin-bottom:20px;" color="primary" disabled>主要按钮禁用</u-button>
        <u-button style="margin-right:20px;margin-bottom:20px;" color="primary_secondary" disabled>次要按钮禁用</u-button>
        <u-button style="margin-right:20px;margin-bottom:20px;" disabled>普通按钮禁用</u-button>
        <u-button style="margin-right:20px;margin-bottom:20px;" color="danger" disabled>危险操作按钮禁用</u-button>
        <u-button style="margin-right:20px;margin-bottom:20px;" color="danger_secondary" disabled>次要危险操作按钮禁用</u-button>

        <div class="componentClassTitle">尺寸</div>
        <u-button style="margin-right:20px;margin-bottom:20px;" size="mini">Mini</u-button>
        <u-button style="margin-right:20px;margin-bottom:20px;" size="small">Small</u-button>
        <u-button style="margin-right:20px;margin-bottom:20px;" size="normal">Normal</u-button>
        <u-button style="margin-right:20px;margin-bottom:20px;" size="medium">Medium</u-button>
        <u-button style="margin-right:20px;margin-bottom:20px;" size="large">Large</u-button>
        <u-button style="margin-right:20px;margin-bottom:20px;" size="huge">Huge</u-button>

        <div class="componentClassTitle">图标</div>
        <u-button style="margin-right:20px;margin-bottom:20px;" icon="add">Add</u-button>
        <u-button style="margin-right:20px;margin-bottom:20px;" icon="refresh">Refresh</u-button>
    </div>
</template>
